import { useState, useEffect } from 'react'
import Header from '@/apps/bug-manager/components/Header'
import TaskPannel from './components/TaskPannel'
import HistoryFinish from './components/HistoryFinish'
import ParticipateEnterprise from './components/ParticipateProject'
import Todo from './components/Todo'
import KeepAlive from 'react-activation'

/**
 * Home page
 */
const HomePage = () => {

  const [data, setData] = useState('')


  useEffect(() => {
    fetcher()
  }, [])

  const fetcher = async () => {
    await new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve('data')
      }, 6000)
    }).then((res: any) => {
      setData(res)
    })
  }

  return <>
    <div className='home-page'>
      <Header />
      <TaskPannel />
      <Todo data={data} />
      <HistoryFinish />
      <ParticipateEnterprise />
    </div>
  </>
}

const KeepAliveHomePage = () => {
  return <KeepAlive name='bug-manager-home' key='bug-manager-home'>
    <HomePage />
  </KeepAlive>
}

export default KeepAliveHomePage
